<template>
  <div class="no_allot">
    <div class="flex flex-horizontal-end flex_btn">
      <Button type="primary" v-if="unlocking('0213030301')"
        @click="allotBtn('selectCheck')">分配线索</Button>
      <Button type="primary" v-if="unlocking('0213030302')"
        @click="allotBtn('all')">分配全部线索</Button>
      <Button type="primary" v-if="unlocking('0213030304')"
        @click="delBtn('selectCheck')">删除线索</Button>
      <Button type="primary" v-if="unlocking('0213030303')"
        @click="delBtn('all')">删除全部线索</Button>
    </div>
    <dt-grid ref="table" page :onFetch='onFetch' :select='select' />
    <allot-modal ref="allotModal" @success='onSuccess' />
  </div>
</template>

<script>
  import columnOpt from '../opt/detailColumns'
  import clueImportMgr from '@/biz/customer/clueImport'
  import allotModal from './allotModal.vue'

  export default {
    components: {
      allotModal
    },
    data() {
      return {
        name: 'no_Allot',
        select: {
          change: (e) => { this.tableChange(e) },
        },
        selectData: [],
        choosedLength: 0,
        totalNum: 0
      }
    },
    methods: {
      allotBtn(type) {
        let obj = {
          num: type == 'all' ? this.totalNum : this.choosedLength,
          recordIds: type == 'all' ? [] : this.selectData,
          batchId: this.$route.query.batchId
        }
        if (type != 'all') {
          if (!this.choosedLength) return this.$Message.warning('请先勾选要分配的线索')
        }
        this.$refs.allotModal.show(obj)
      },
      delBtn(type) {
        console.log(this.selectData, this.choosedLength)
        if (type != 'all' && !this.choosedLength) return this.$Message.warning('请先勾选要删除的线索')
        this.$Modal.confirm({
          title: '提示',
          content: `未分配线索客户删除后不可恢复是否要删除？`,
          okText: '确认',
          closable: true,
          onOk: () => {
            let params = {
              batchId: this.$route.query.batchId
            }
            if (type != 'all') {
              params.ids = this.selectData
            }
            clueImportMgr.deleteByDetailIds(params).then(res => {
              this.$Message.success('删除成功')
              this.$refs.table.fetch(true)
            })
          }
        })
      },
      //表格选中
      tableChange(val) {
        this.selectData = []
        if (val && val.length) {
          this.choosedLength = val.length
          val.forEach((item) => {
            if (item.id) {
              this.selectData.push(Number(item.id))
            }
          })
        } else {
          this.selectData = []
          this.choosedLength = 0
        }
      },
      onFetch(data) {
        let params = {
          ...data,
          batchId: Number(this.$route.query.batchId),
          type: 0
        }
        return clueImportMgr.getOperationDetailList(params).then(res => {
          this.totalNum = res.total
          res.list = res.records
          this.selectData = []
          this.choosedLength = 0
          return res
        })
      },
      onSuccess() {
        this.$refs.table.fetch(true)
      }
    },
    mounted() {
      this.$refs.table.init(this, new columnOpt.ColumnAllot(this))
      this.$refs.table.fetch()
    }
  }
</script>

<style lang="scss" scoped>
  .no_allot {
    .flex_btn {
      button {
        margin-left: 10px;
      }
    }
  }
</style>